// 1.显示登录人员的欢迎信息  2.校验用户是否登录
let isHaveUid = getCookie("uid");
let showNameEle = document.querySelector(".showName");
if (typeof isHaveUid != "undefined") {
  // 登录了；显示用户名
  let username = getCookie("username");
  showNameEle.innerHTML = `${username} 欢迎您`;
}else{
    alert("请先登入");
    window.location.href="centers.html";

}

getCartList();
// 通过ajax来获取数据
function getCartList() {
  ajax({
    url: "./php/getCartList.php",
    data: {
      uid: isHaveUid,
    },
    dataType: "json",
  }).then((res) => {
    console.log(res);
    renderDom(res);
    addEvent();
    minuNum();
    del();
  });
}

function renderDom(data) {
  var tbody = document.querySelector("tbody");
  tbody.innerHTML = "";
  data.forEach(function (item) {
    //   if (item.ischecked) {
    //     var isCheckStr = `<input class="check-one check" checked  type="checkbox" />`;
    //   } else {
    //     var isCheckStr = `<input class="check-one check"   type="checkbox" />`;
    //   }
    var trEle = document.createElement("tr");
    trEle.innerHTML = `
                        <td class="checkbox"><input class="check-one check"   type="checkbox" /></td>
                            <td class="goods"><img src="${item.img}"
                                    alt="" /><span>${item.pname}</span></td>
                            <td class="price">${(
                              (item.price * 100) /
                              100
                            ).toFixed(2)}</td>
                            <td class="count">${
                              item.num <= 1
                                ? '<span class="reduce"></span>'
                                : '<span class="reduce">-</span>'
                            }<input class="count-input" type="text" myid="${item.id}"
                                    value="${
                                      item.num
                                    }" /><span class="add" >+</span></td>
                            <td class="subtotal">${(
                              (item.num * (item.price * 100)) /
                              100
                            ).toFixed(2)}</td>
                            <td class="operation"><span class="delete" myid="${
                              item.id
                            }">删除</span></td>
                        `;
    tbody.appendChild(trEle);
  });
}

function addEvent() {
  //点击添加
  var addEles = document.querySelectorAll(".add");
  addEles.forEach((item) => {
    item.onclick = function () {
      var val = parseInt(this.previousElementSibling.value) + 1;
      // console.log(val)
      var id = this.previousElementSibling.getAttribute("myid");
      ajax({
        url: "./php/addNum.php",
        method: "post",
        data: {
          id,
          val,
        },
        dataType: "json",
      }).then((res) => {
        // console.log(res)
        getCartList();
      });
    };
  });
}
//点击减少
function minuNum() {
  var minusEles = document.querySelectorAll(".reduce");
  minusEles.forEach((item) => {
    item.onclick = function () {
      var id = this.nextElementSibling.getAttribute("myid");
      var val = this.nextElementSibling.value;
      if (val > 1) {
        val = val - 1;
        ajax({
          url: "./php/minusNum.php",
          method: "post",
          data: {
            id,
            val,
          },
          dataType: "json",
        }).then((res) => {
          // console.log(res)
          getCartList();
        });
      }
    };
  });
}

//点击删除
function del() {
  var deleteEles = document.querySelectorAll(".delete");
  deleteEles.forEach((item) => {
    item.onclick = function () {
      var id = this.getAttribute("myid");
      console.log(id);
      ajax({
        url: "./php/del.php",
        method: "post",
        data: {
          id,
        },
        dataType: "json",
      }).then((res) => {
        console.log(res);
        getCartList();
      });
    };
  });
}
